<section class="container" data-page="<%= String.downcase(@block_type) %>-list">
  <%= render BlockScoutWeb.Advertisement.TextAdView, "index.html", conn: @conn %>
  <div class="card">
    <div class="card-body" data-async-listing="<%= @current_path %>">
      <%= render BlockScoutWeb.CommonComponentsView, "_channel_disconnected_message.html", text: gettext("Connection Lost, click to load newer blocks") %>

      <h1 class="card-title list-title-description"><%= gettext("%{block_type}s", block_type: @block_type) %></h1>

      <div class="list-top-pagination-container-wrapper">
        <%= render BlockScoutWeb.CommonComponentsView, "_pagination_container.html", position: "top", cur_page_number: "1", show_pagination_limit: true, data_next_page_button: true, data_prev_page_button: true %>
      </div>

      <div data-items>
        <%= render BlockScoutWeb.CommonComponentsView, "_tile-loader.html" %>
      </div>
      <div data-empty-response-message style="display: none;">
          <span><%= gettext "There are no blocks." %></span>
      </div>

      <%= render BlockScoutWeb.CommonComponentsView, "_pagination_container.html", position: "bottom", cur_page_number: "1", show_pagination_limit: true, data_next_page_button: true, data_prev_page_button: true %>

    </div>
  </div>
  <script defer data-cfasync="false" src="<%= static_path(@conn, "/js/blocks.js") %>"></script>
</section>
